﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebInicial.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <!--<![endif]-->
    <title>Tres Mapaches</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
    <link rel="stylesheet" href="css/layout.css" type="text/css" media="all">
    <link rel="stylesheet" href="css/style.css" type="text/css" media="all">
    <link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" type="text/css" media="all">
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300'
        rel='stylesheet' type='text/css'>
    <script type="text/javascript" src="js/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="js/scripts.js"></script>
    <!--[if lt IE 9]>
  	<script type="text/javascript" src="js/html5.js"></script>
    <link rel="stylesheet" href="css/ie.css" type="text/css" media="all">
    
  <![endif]-->
    <!--[if lt IE 8]>
		<div style=' clear: both; text-align:center; position: relative;'>
			<a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." /></a>
		</div>
	<![endif]-->
</head>
<body>
    <div class="glob">
        <div class="page_spinner">
        </div>
        <div class="main">
            <div class="center">
                <!--header -->
                <div class="headerHolder">
                    <header>
                        <div class="logoHolder">
                            <h1>
                                <a href="#!/pageGallery" id="logo">oratorio</a></h1>
                        </div>
                    </header>
                    <div class="followHolder">
                        <span>Tel: +54 (011) 6720 2459</span>
                        <ul>
                            <li><a href="#">
                                <img src="images/followIcon1.png" alt=""></a></li>
                            <li><a href="#">
                                <img src="images/followIcon2.png" alt=""></a></li>
                            <li><a href="#">
                                <img src="images/followIcon3.png" alt=""></a></li>
                        </ul>
                    </div>
                </div>
                <!--header end-->
                <div class="menuHolder">
                    <nav class="menu">
                        <ul id="menu">
                            <li class="with_ul"><a href="#!/pageAbout"><span class="overPlane"></span><span class="mText">
                                acerca</span></a>
                                <!--                                   
                                    <ul class="submenu_1">
                                	   <li><a href="#!/pageMore">Bienvenidos</a></li>
                                	   <li><a href="#!/pageMore">Nosotros</a></li>
                                	   <li><a href="#!/pageMore">Historia</a></li>
                                    </ul>
-->
                            </li>
                            <li><a href="#!/pageServices"><span class="overPlane"></span><span class="mText">servicios</span></a>
                                <ul class="submenu_1">
                                    <li><a href="#!/pageCotizador">cotizador</a></li>
                                </ul>
                            </li>
                            <li><a href="#!/pageGallery"><span class="overPlane"></span><span class="mText">galer&iacute;a</span></a></li>
                            <li><a href="#!/pagePrivacy"><span class="overPlane"></span><span class="mText">garant&iacute;a</span></a></li>
                            <li><a href="#!/pageContact"><span class="overPlane"></span><span class="mText">contacto</span></a></li>
                        </ul>
                    </nav>
                </div>
                <!--content -->
                <article id="content">
                    <div class="ic">
                    </div>
                    <div class="iconHolder">
                        <div id="img_slider">
                            <ul>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon1.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon2.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon3.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon4.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon5.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon6.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon7.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon8.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon9.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon1.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon2.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon3.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon4.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon5.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon6.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon7.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon8.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon9.jpg" alt=""></a></div>
                                </li>
                                <li>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon4.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon6.jpg" alt=""></a></div>
                                    <div class="picHold">
                                        <a class="pic" rel="Appendix" href="images/image-blank.png"><span class="zoomSp"></span>
                                            <img src="images/galleryIcon5.jpg" alt=""></a></div>
                                </li>
                            </ul>
                        </div>
                        <a href="#" id="next">
                            <img src="images/gallNext1.png" alt=""></a> <a href="#" id="prev">
                                <img src="images/gallPrev1.png" alt=""></a>
                    </div>
                    <ul>
                        <li id="pageAbout">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <h2>
                                        Bienvenidos a nuestro sitio!</h2>
                                    <div class="col1 padBot1">
                                        <figure class="_fig1">
                                            <img src="images/page1pic1.png" alt="">
                                        </figure>
                                        <div class="col2">
                                            <p>
                                                TresMapaches.com.ar fue creada con la misi&oacute;n fundamental de lograr plasmar
                                                sus ideas en algo tangible y redituable. El beneficio siempre es de ambas partes,
                                                pero solo si logramos que su negocio se beneficie y aumente en rentabilidad. Por
                                                eso nuestra empresa se destaca del resto, sus valores son nuestros valores y su
                                                necesidad es nuestro objetivo.</p>
                                        </div>
                                    </div>
                                    <div class="col1 padBot2">
                                        <div class="col3 bord1 magRight1">
                                            <ul class="_list1">
                                                <li><a href="#">Servicio bosquejo a web (BaW)</a></li>
                                                <li><a href="#">Ideas materializadas en horas</a></li>
                                                <li><a href="#">Lo &uacute;ltimo en tecnolog&iacute;a WEB.</a></li>
                                            </ul>
                                        </div>
                                        <div class="col3">
                                            <ul class="_list1">
                                                <li><a href="#">Sitios optimizados para m&oacute;biles</a></li>
                                                <li><a href="#">Metodolog&iacute;a &aacute;gil de desarrollo</a></li>
                                                <li><a href="#">Gr&aacute;ficos e im&aacute;genes HD vectorizados</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                    <a class="moreButton" href="#!/pageMore">Leer mas</a>
                                </div>
                            </div>
                        </li>
                        <li id="pageServices">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <h2>
                                        Que hacemos</h2>
                                    <div class="col1 padBot3">
                                        <div class="col4 magRight2">
                                            <h3>
                                                <a class="_link3" href="#">Dise&ntilde;o y maquetado Web</a></h3>
                                            <p>
                                                Desarrollo de sitios &aacute;giles y llamativos, con lo &uacute;ltimo de tecnolog&iacute;a
                                                Web. Tanto el dise&ntilde;o como el maquetado sirven a nuestros clientes para sacar
                                                r&eacute;dito de sus negocios, creando sitios que lleguen f&aacute;cil y claramente
                                                al usuario final.</p>
                                        </div>
                                        <div class="col4">
                                            <h3>
                                                <a class="_link3" href="#">Dise&ntilde;o Gr&aacute;fico</a></h3>
                                            <p>
                                                Gr&aacute;ficos vectorizados en alta definici&oacute;n que plasman grandes ideas
                                                en dise&ntilde;os &uacute;tiles y reusables. Desde el comienzo usted tendr&aacute;
                                                acceso total a todo componente que posee el diseno que se esta trabajando.</p>
                                        </div>
                                    </div>
                                    <div class="col1">
                                        <div class="col4 magRight2">
                                            <h3>
                                                <a class="_link3" href="#">Dise&ntilde;o Empresarial</a></h3>
                                            <p>
                                                Permitimos a su empresa proyectar su negocio a trav&eacute;s de distintos materiales
                                                de promoci&oacute;n e imprenta. Folleteria, panfletos, logotipos, y otros objetos
                                                institucionales que su empresa necesita.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li id="pageGallery"></li>
                        <li id="pageCotizador">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <h2>
                                        Genere su presupuesto</h2>
                                    <div class="col1">
                                        <div class="Btns1">
                                            <a href="#" class="upBtn"></a><a href="#" class="downBtn"></a>
                                        </div>
                                        <div class="scroll1">
                                            <select name="thelist" onchange="combo(this, 'theinput')">
                                                <option>Dise&ntilde;o y Maquetado Web</option>
                                                <option>Dise&ntilde;o Empresarial</option>
                                                <option>Dise&ntilde;o Gr&aacute;fico</option>
                                            </select>
                                            </br>
                                            <p>
                                                En construcci&oacute;n.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li id="pagePrivacy">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <h2>
                                        Garant&iacute;a de calidad</h2>
                                    <div class="col1">
                                        <div class="Btns1">
                                            <a href="#" class="upBtn"></a><a href="#" class="downBtn"></a>
                                        </div>
                                        <div class="scroll1">
                                            <p class="padBot4">
                                                Somos 3 grandes profesionales que tenemos la gracia de disponer de los conocimientos
                                                funcionales y t&eacute;cnicos necesarios para concretar ideas, conceptos o demostraciones.
                                                Nos destacamos por nuestros estudios en varios &aacute;mbitos y nuestras ganas de
                                                brindar un servicio completo y satisfactorio a nuestros clientes. Aqu&iacute; nadie
                                                pierde y se apuesta siempre a concretar ideas conceptuales en materiales con el
                                                mayor profesionalismo y manteniendo siempre el buen trato que nos caracteriza. Con
                                                su ayuda y su pedido queremos lograr que nuestra empresa empiece a sonar en los
                                                o&iacute;dos de personas como usted, que se atreven a ir por mas y concretar a toda
                                                costa su emprendimiento. Con el tiempo se dar&aacute; cuenta que nos parecemos bastante,
                                                pues como anteriormente se menciona sus valores son nuestros valores y su idea,
                                                nuestro objetivo. Lograremos sin ninguna duda darle un 100% de satisfacci&oacute;n
                                                garantizada, o por lo menos un 100% de seguridad de que lucharemos para otorgarla"
                                            </p>
                                            <p class="padBot4">
                                                Los Tres Mapaches.<p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li id="pageContact">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <div class="col5 magRight3">
                                        <h2>
                                            contacto</h2>
                                        <div class="wrapper">
                                            <form action="#" id="ContactForm" runat="server">

                                            <fieldset class="left">
                                                <div class="block">
                                                    <label class="name padRight3">
                                                        <span class="title1">Nombre:</span> <span class="bg">
                                                            <%--<input type="text" value="" class="input">--%>
                                                            <asp:TextBox type="text" runat="server" ID="txtNombre" value="" class="input"></asp:TextBox></span>
                                                        <span class="error">*No es nombre valido.</span> <span class="empty">*Este campo es
                                                            requerido.</span>
                                                    </label>
                                                    <label class="email">
                                                        <span class="title1">Email:</span> <span class="bg">
                                                            <%--<input type="email" value="" class="input">--%>
                                                            <asp:TextBox runat="server" ID="txtEmail" type="email" value="" class="input"></asp:TextBox></span>
                                                        <span class="error">*No es una direccion de correo valida.</span> <span class="empty">
                                                            *Este campo es requerido.</span></label>
                                                    <label class="phone">
                                                        <span class="title1">Telefono:</span> <span class="bg">
                                                            <%--<input type="tel" value="" class="input">--%>
                                                            <asp:TextBox runat="server" ID="txtTelefono" type="tel" value="" class="input"></asp:TextBox></span>
                                                        <span class="error">*No es un numero valido.</span> <span class="empty">*Este campo
                                                            es requerido.</span>
                                                    </label>
                                                </div>
                                                <div class="block">
                                                    <label class="message">
                                                        <span class="title1">Mensaje:</span> <span class="bg">
                                                            <%--<textarea rows="1" cols="2"></textarea>--%>
                                                            <asp:TextBox runat="server" ID="txtMensaje" TextMode="MultiLine" CssClass="input"></asp:TextBox></span>
                                                        <span class="error">*El mensaje es muy corto.</span> <span class="empty">*Este campo
                                                            es requerido.</span>
                                                    </label>
                                                </div>
                                                <div class="formButtons">
                                                    <div class="formBtn">
                                                        <%--<a href="#" data-type="submit" class="moreButton">Enviar</a>--%>
                                                        <asp:LinkButton runat="server" ID="btnEnviar" CssClass="moreButton" OnClick="btnEnviar_Click"
                                                            Text="Enviar"></asp:LinkButton>
                                                    </div>
                                                    <div class="formBtn">
                                                        <%--<a href="#" data-type="reset" class="moreButton">Limpiar</a>--%>
                                                        <asp:LinkButton runat="server" ID="btnLimpiar" CssClass="moreButton" OnClick="btnLimpiar_Click"
                                                            Text="Limpiar"></asp:LinkButton>
                                                    </div>
                                                </div>
                                            </fieldset>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="col5">
                                        <h2>
                                            Ubiquenos</h2>
                                        <!-- <div class="padBot5">
                                        <figure class="google_map"></figure> 
                                    </div>-->
                                        <div class="col5">
                                            <p>
                                                <span>Perito Moreno 2340,Villa Luzuriaga,<br>
                                                    Buenos Aires, Argentina.</span><br>
                                                <span class="space1">Telefono:</span>+54 011 4659 3004<br>
                                                <span>E-mail:&nbsp;<a class="_link1" href="mailto:info@tresmapaches.com.ar">info@tresmapaches.com.ar</a></span>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li id="pageMore">
                            <div class="box">
                                <div class="closePlane">
                                    <a class="closeButton" href="#!/pageGallery">
                                        <img src="images/closeIcon.png" alt=""></a>
                                </div>
                                <div class="containerContent">
                                    <h2>
                                        Como nos diferenciamos?</h2>
                                    <div class="col1">
                                        <div class="Btns2">
                                            <a href="#" class="upBtn"></a><a href="#" class="downBtn"></a>
                                        </div>
                                        <div class="scroll2">
                                            <p class="padBot4">
                                                En construcci&oacute;n.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </article>
                <!--content end-->
                <!--footer -->
                <footer>
                    <!-- {%FOOTER_LINK} -->
                    <div class="mainFooter">
                        <div class="privHold">
                            <pre class="textPrivacy">Copyright @2014 TresMapaches.com.ar , Buenos Aires, Argentina</pre>
                        </div>
                    </div>
                </footer>
                <!--footer end-->
            </div>
        </div>
    </div>
    <script>
        $(window).load(function () {
            $('.page_spinner').fadeOut();
            $('body').css({ overflow: 'auto', 'min-height': '800px' })
        })
    </script>
</body>
</html>
